<script setup lang="ts">
import {videoImagesDir} from '@/utils/config.ts'
import TextInfo from '@/components/text-info.vue'

const imageWidth = 397
const imageHeight = Math.ceil(imageWidth * 9 / 16)

import {DreamVideo} from '@/data/Dream'

defineProps<{
  video: DreamVideo
}>()
</script>

<template>
  <a-image-preview-group >
  <div class="video-images">
    <div class="video-image">
      <a-image :width="imageWidth"
               :height="imageHeight"
               :src="videoImagesDir + video.images[0]"
      />
    </div>
  </div>
  </a-image-preview-group>

  <text-info :video="video"/>
</template>

<style scoped lang="stylus">
.video-images
  .video-image
    margin-bottom 3px
</style>